// @ts-nocheck
// OHOS
import xbone_data from "../../common/json/export_data.json"
import { Xbone } from "xbone/xbone_ohos.js"

export default {
    data: {
        playType:true,
        btnStyle:{
            text:"播放",
            color:"#39A9B5"
        }
    },
    onShow() {
        let dom = this.$element("xbone")
        let ctx = dom.getContext("2d")
        let width = 720
        let height = 1560
        // xbone run
        let option = {
            ctx: ctx, //canvas context
            data: xbone_data, //from XstoryMake app export
            width: width, //canvas width
            height: height, //canvas height
            // A required CallBack
            animeCall: (anime_gridList = []) => {
                if (anime_gridList.length > 0) {
                    this.xbone.reloadImgDraw(anime_gridList);
                } else {
                    this.xbone.reloadImgDraw();
                }
            },
            // input your dev scene: "ohos" or "web"
            clientScene: "ohos",
        };
        this.xbone = new Xbone(option);
    },
    changePlayType(){
        this.playType = !this.playType
        if(this.playType){
            this.xbone.pause()
            this.btnStyle.text = "暂停"
            this.btnStyle.color = "#D6AC3F"
        }else{
            this.xbone.play()
            this.btnStyle.text = "播放"
            this.btnStyle.color = "#39A9B5"
        }
    }

}



